<template>
    <div class="level-container">
        <div ref="parent" class="game-map">
            <canvas ref="canvas" tabindex="0"></canvas>
        </div>

        <!-- 引入公共游戏组件 -->
        <GameComponents
            :isPaused="isPaused"
            :gameOver="showGameResult"
            :gameWon="isVictory"
            :resultMessage="isVictory ? '你已击败所有敌人！' : '你被敌人击败了！'"
            :showExitConfirm="showExitConfirm"
            :remainingTime="gameTime"
            :totalAiCount="totalAiCount"
            :aliveAiCount="aliveAiCount"
            @pause="togglePause"
            @resume="resumeGame"
            @restart="restartGame"
            @exit="exitGame"
            @simulateCompletion="simulateCompletion"
            @closeExitConfirm="showExitConfirm = $event"
        />
    </div>
</template>

<script setup>
import { SingleMap } from '@/assets/scripts/single/SingleMap'
import { ref, onMounted, onUnmounted, defineEmits, watch, computed } from 'vue'
import { GameObject } from '@/assets/scripts/GameObject'
import GameComponents from '@/components/GameComponents.vue'

// 定义事件
const emit = defineEmits(['complete'])

let parent = ref(null)
let canvas = ref(null)
let gameMapInstance = null
let gameTime = ref(90)  // 设置初始90秒倒计时
let score = ref(0)
let gameTimer = null
let showGameResult = ref(false)
let isVictory = ref(false)
let isPaused = ref(false)
let showExitConfirm = ref(false)

// AI统计数据
const totalAiCount = ref(0)
const deadAiCount = ref(0)

// 计算属性：存活的AI数量
const aliveAiCount = computed(() => {
    return totalAiCount.value - deadAiCount.value
})

// 更新AI存活状态
const updateAiStatus = () => {
    if (!gameMapInstance || !gameMapInstance.players) return

    // 计算当前实际死亡的AI数量
    const aiPlayers = gameMapInstance.players.filter((p) => p.info.role === 'AI')
    const deadAIs = aiPlayers.filter((p) => p.is_dead || p.info.hp <= 0)

    // 如果计数与实际不符，更新死亡计数
    if (deadAIs.length !== deadAiCount.value) {
        deadAiCount.value = deadAIs.length
        console.log(`更新AI死亡计数: ${deadAiCount.value}/${totalAiCount.value}`)
    }

    // 如果所有AI都死亡了，且还没有结束游戏，触发胜利
    if (aliveAiCount.value === 0 && totalAiCount.value > 0 && !showGameResult.value) {
        handleGameOver(true)
    }
}

const resize = () => {
    if (!parent.value || !canvas.value) return

    try {
        // 获取父容器尺寸并设置canvas尺寸
        canvas.value.width = parent.value.clientWidth
        canvas.value.height = parent.value.clientHeight

        // 如果游戏地图实例存在，则调用resize方法
        if (gameMapInstance && typeof gameMapInstance.resize === 'function') {
            gameMapInstance.resize()
        }
    } catch (error) {
        console.error('调整画布大小时出错:', error)
    }
}

// 初始化游戏循环
const startGameLoop = () => {
    const fps = 60
    const frameInterval = 1000 / fps
    let lastFrameTime = performance.now()

    function gameLoop(currentTime) {
        if (!gameMapInstance) return

        // 检查游戏是否暂停
        if (isPaused.value) {
            // 如果暂停，只更新lastFrameTime而不更新游戏
            lastFrameTime = currentTime
            requestAnimationFrame(gameLoop)
            return
        }

        const elapsed = currentTime - lastFrameTime

        if (elapsed > frameInterval) {
            lastFrameTime = currentTime - (elapsed % frameInterval)

            // 更新游戏
            gameMapInstance.update()
        }

        // 请求下一帧
        requestAnimationFrame(gameLoop)
    }

    // 启动游戏循环
    requestAnimationFrame(gameLoop)
}

// 游戏结束处理
const handleGameOver = (wonGame) => {
    clearInterval(gameTimer)
    isVictory.value = wonGame

    // 根据游戏结果更新得分
    if (wonGame) {
        score.value += 100 // 胜利奖励
    }

    // 显示结果弹窗
    setTimeout(() => {
        showGameResult.value = true
    }, 1000)
}

// 玩家死亡处理
const handlePlayerDeath = (player) => {
    // 如果是AI死亡，增加分数
    if (player.info.role === 'AI') {
        score.value += 30

        // 确保标记玩家为死亡状态
        player.is_dead = true

        // 更新AI死亡状态统计
        updateAiStatus()
    }
}

// 游戏计时器 - 倒计时版本
const startGameTimer = () => {
    // 如果已经有计时器，先清理
    if (gameTimer) {
        clearInterval(gameTimer)
    }

    gameTimer = setInterval(() => {
        // 只有在非暂停状态下才减少游戏时间
        if (!isPaused.value) {
            if (gameTime.value > 0) {
                gameTime.value -= 1
                
                // 更新AI状态
                updateAiStatus()
                
                // 当倒计时结束时，如果还没有游戏结果，则触发游戏失败
                if (gameTime.value === 0 && !showGameResult.value) {
                    handleGameOver(false)
                }
            }
        }
    }, 1000)
}

// 模拟完成游戏
const simulateCompletion = () => {
    handleGameOver(true)
}

// 暂停游戏
const togglePause = () => {
    isPaused.value = !isPaused.value
    if (isPaused.value) {
        GameObject.pause_game()
        // 暂停游戏计时器
        clearInterval(gameTimer)
    } else {
        GameObject.resume_game()
        // 恢复游戏计时器
        startGameTimer()
    }
}

// 继续游戏
const resumeGame = () => {
    isPaused.value = false
    GameObject.resume_game()
    // 恢复游戏计时器
    startGameTimer()
}

// 重新开始游戏
const restartGame = () => {
    // 先清理当前游戏对象
    GameObject.clearAll()

    // 重置状态
    isPaused.value = false
    showGameResult.value = false
    gameTime.value = 90  // 重置为90秒
    score.value = 0

    // 重新初始化游戏地图
    if (canvas.value) {
        try {
            gameMapInstance = new SingleMap(canvas.value.getContext('2d'), 'first')

            // 记录AI总数，重置死亡计数
            totalAiCount.value = gameMapInstance.players.filter((p) => p.info.role === 'AI').length
            deadAiCount.value = 0

            console.log('第一关初始化完成，AI总数:', totalAiCount.value)

            // 设置游戏事件回调
            gameMapInstance.setEventCallback('onGameOver', handleGameOver)
            gameMapInstance.setEventCallback('onPlayerDeath', handlePlayerDeath)

            // 启动游戏计时器
            startGameTimer()
        } catch (error) {
            console.error('重新创建游戏地图实例时出错:', error)
        }
    }
}

// 退出游戏
const exitGame = () => {
    showExitConfirm.value = false
    isPaused.value = false

    // 清理游戏计时器
    clearInterval(gameTimer)

    // 清理游戏实例
    if (gameMapInstance) {
        try {
            // 使用静态方法清理所有游戏对象
            GameObject.clearAll()
        } catch (error) {
            console.warn('清理游戏对象时出错:', error)
        }

        gameMapInstance = null
    }

    // 通知父组件退出游戏
    emit('complete')
}

// 监听暂停状态变化
watch(isPaused, (newValue) => {
    // 如果从暂停恢复到正常状态，需要重新获取焦点
    if (!newValue && canvas.value) {
        canvas.value.focus()
    }
})

onMounted(() => {
    if (!parent.value || !canvas.value) {
        console.error('游戏容器或画布未正确初始化')
        return
    }

    // 设置画布焦点，使其能接收键盘事件
    canvas.value.focus()

    // 添加键盘事件监听
    canvas.value.addEventListener('keydown', handleKeyDown)

    // 初始化游戏地图
    try {
        gameMapInstance = new SingleMap(canvas.value.getContext('2d'), 'first')

        // 记录AI总数，重置死亡计数
        totalAiCount.value = gameMapInstance.players.filter((p) => p.info.role === 'AI').length
        deadAiCount.value = 0

        console.log('第一关初始化完成，AI总数:', totalAiCount.value)

        // 设置游戏事件回调
        gameMapInstance.setEventCallback('onGameOver', handleGameOver)
        gameMapInstance.setEventCallback('onPlayerDeath', handlePlayerDeath)

        // 添加调试输出
        console.log('游戏地图实例创建成功:', {
            width: canvas.value.width,
            height: canvas.value.height,
            players: gameMapInstance.players.length,
        })
    } catch (error) {
        console.error('创建游戏地图实例出错:', error)
    }

    // 调整画布大小
    resize()

    // 监听窗口大小变化
    window.addEventListener('resize', resize)

    // 启动游戏循环
    startGameLoop()

    // 启动游戏计时器
    startGameTimer()

    // 额外调用一次resize，确保画布在首次渲染时正确显示
    window.requestAnimationFrame(() => {
        resize()
    })
})

onUnmounted(() => {
    window.removeEventListener('resize', resize)
    clearInterval(gameTimer)

    // 移除键盘事件监听
    if (canvas.value) {
        canvas.value.removeEventListener('keydown', handleKeyDown)
    }

    // 清理游戏实例
    if (gameMapInstance) {
        try {
            // 使用静态方法清理所有游戏对象
            GameObject.clearAll()
        } catch (error) {
            console.warn('清理游戏对象时出错:', error)
        }

        gameMapInstance = null
    }
})

// 处理键盘事件
const handleKeyDown = (event) => {
    // Esc键暂停/恢复游戏
    if (event.key === 'Escape') {
        // 如果显示退出确认或游戏结果弹窗，则先关闭
        if (showExitConfirm.value) {
            showExitConfirm.value = false
            return
        }

        if (showGameResult.value) {
            return
        }

        togglePause()
    }
}
</script>

<style scoped>
.level-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.game-map {
    flex: 1;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background: #070707;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

canvas {
    display: block;
    width: 100%;
    height: 100%;
    cursor: crosshair;
}
</style>
